<script setup lang="ts">
import navBar from "@/components/navBar.vue";
import tabbar from "./components/tabbar.vue";
import { useRoute } from "vue-router";
import { inject, watchEffect } from "vue";

const route = useRoute();
let loading = inject<any>("loading");

watchEffect(() => {
  if (route.name == "login") {
    loading.value = false;
  }

});


</script>

<template>
  <div>
    <navBar></navBar>
  </div>
  <div>
    <div style="position: relative">


      <div style="position: fixed" class="bottom-[250px] left-[45%] z-[99]">
        <van-loading size="24" color="#0094ff" vertical v-if="loading">加载中...</van-loading>
      </div>

      <RouterView :key="route.fullPath"></RouterView>
    </div>
  </div>

  <div v-if="route.name == 'home' || route.name == 'mine' || route.name == 'product'
          ">
    <tabbar></tabbar>
  </div>
</template>

<style scoped>
body {
  border: 1px solid red !important;
}
</style>
